<template>
  <div class="mainbg">
    <div class="main">
      <div class="mainUp">
        <span>主机话筒：</span>
        <select v-model="selectedOption" @change="handleSelect">
            <option value="" disabled>NONE</option>
            <option v-for="(item, index) in MICs" :key="index">
              {{ item }}
            </option>
          </select>
        <button>设 置</button>
      </div>
      <div class="mainCenter">
        <span>输出声卡：</span>
        <select v-model="selectedOption" @change="handleSelect">
            <option value="" disabled>NONE</option>
            <option v-for="(item, index) in soundCards" :key="index">
              {{ item }}
            </option>
          </select>
        <button>设 置</button>
      </div>
      <div class="mainBottom">
        <span>播放外置音源LINE设备掉线恢复工作模式：</span>
        <select v-model="selectedOption" @change="handleSelect">
            <option value="" disabled>NONE</option>
            <option v-for="(item, index) in LINEmodes" :key="index">
              {{ item }}
            </option>
          </select>
      </div>
    </div>
  </div>
</template>
<script setup>
import { ref } from "vue";
const MICs = ref(["111", "222"]);
const soundCards = ref(["111", "222"]);
const LINEmodes = ref(["111", "222"]);
</script>
<style scoped>
@import url("./soundless/soundCard.less");
</style>